<template>
  <div class="name-card-item border-bottom-1px">
    <div class="img" :style="{'background-image': 'url('+img+')'}"></div>
    <div class="content">
      <h1>{{name}}</h1>
      <p>{{desc}}</p>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    img: {
      type: String, // 企业logo图片url
      default: ''
    },
    name: {
      type: String, // 企业名称
      default: ''
    },
    desc: {
      type: String, // 企业简介
      default: ''
    },
    itemid: {
      type: String, // 企业id
      default: ''
    }
  }
}
</script>

<style scoped lang="scss">
.name-card-item {
  width: 6.9rem;
  height: 1.97rem;
  margin: 0 auto 0.3rem;
  display: flex;
  justify-content: space-between;
  .img {
    width: 2.58rem;
    height: 1.6rem;
    background: center no-repeat;
    background-size: contain;
  }
  .content {
    width: 3.78rem;
    h1 {
      font-size: 0.32rem;
      color: #222;
      padding-left: 0.19rem;
      position: relative;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      &::after {
        position: absolute;
        content: "";
        width: 0.06rem;
        height: 0.36rem;
        background-color: #ffd74d;
        left: 0;
        top: 0.03rem;
      }
    }
    p {
      width: 3.58rem;
      font-size: 0.24rem;
      color: #222;
      line-height: 0.36rem;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      /* autoprefixer: ignore next */
      -webkit-box-orient: vertical;
      margin: 0.18rem 0 0 0.19rem;
    }
  }
}
</style>
